<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1 id="main">jQuery</h1>
    <h1>heoll</h1>
    <script>
        //$("main").html();
        (function(){
            var jquery=window.$=function(xzq){
                console.log("我的框架");
                return new jquery.prototype.init(xzq);
            }
            jquery.prototype={
                init:function(xzq){
                    let arr=document.querySelectorAll(xzq);
                    Array.prototype.push.apply(this,arr)
                    return this;
                },
                html:function(v){
                    if(v==undefined){
                        return this[0].innerHTML;
                    }
                    for(let i=0;i<this.length;i++){
                        this[i].innerHTML=v;
                    }
                },
                css:function(bgcolor,color){
                    if(color==undefined){
                        return this[0].style[bgcolor]
                    }
                    for(let i=0;i<this.length;i++){
                        this[i].style[bgcolor]=color
                    }
                    return this;
                }
            }
            jquery.extends=function(obj){
                for(let attr in obj){
                    this[attr]=obj[attr]
                }
            }
            jquery.prototype.init.prototype=jquery.prototype;

        })();
        // $("h1").html("国服盲僧")
        // $("h1").css("backgroundColor","red")
        // console.log($("h1").html());
        // var aa=document.querySelector("h1")
        // aa.style.backgroundColor=red;
        $.extends({
            trim:function(str){
                return str.replace(/^\s+|\s+$/g,"")
            }
        })
        let t='   hello   world    '
        console.log(t);
        console.log($.trim(t));
  
    </script>
</body>
</html>